import styles from './index.less';
import React, { useEffect } from 'react';
import { TjTable } from '@/pages/ETrade/components';
import { useTablePipeline } from 'ali-react-table';
import { baseTableStyle, columns } from './helper';
import { Space } from 'antd';
import { useSetState } from 'ahooks';
import DetailDrawer from '../DetailDrawer';
import { HttpCode } from '#/utils/contacts.js';
import { getAllPerson } from '../../services';
import { OnHistory } from '#/utils/interactive';
const Container = ({ dataSource, getDataSource, params }) => {
  const [state, setState] = useSetState({
    drawer_show: false,
    personList: [],
  });
  useEffect(async () => {
    const res = await getAllPerson();
    if (res?.statusCode === HttpCode.SUCCESS) {
      setState({
        personList: res.data,
      });
    }
  }, []);
  const showDetail = async ({ type, row, getDataSource }) => {
    if (type === 'redirect') {
      OnHistory({
        path: '/GreenCertificateManagement/GreenCertificateAnalysis',
        params: row,
        openType: 1,
      });
      return;
    }
    setState({ drawer_show: true });
    let info = { ...row, startMonth: params.startMonth, endMonth: params.endMonth };
    const result = await DetailDrawer.show({
      type,
      row: info,
      personList: state.personList,
      getDataSource,
    });
    if (result.index === 0) {
      setState({ drawer_show: false });
    }
  };
  const pipeline = useTablePipeline({ components: {} })
    .input({
      dataSource,
      columns: [
        ...columns,
        {
          code: 'tes13',
          name: '操作',
          align: 'center',
          width: 100,
          render: (t, row) => (
            <Space>
              <a onClick={() => showDetail({ type: 'detail', row, getDataSource })}>查看</a>
              <a onClick={() => showDetail({ type: 'edit', row, getDataSource })}>编辑</a>
              <a onClick={() => showDetail({ type: 'redirect', row })}>分析</a>
            </Space>
          ),
        },
      ].map((i) => ({ ...i, width: i.width || 50 })),
    })
    .primaryKey('id');

  return (
    <div className={styles.body}>
      <div className={styles.title}>场站概览</div>
      <div className={styles.content}>
        <TjTable
          // style={baseTableStyle}
          useOuterBorder={true}
          stickyScrollHeight={10}
          useVirtual={{ horizontal: true, vertical: true, header: false }}
          defaultColumnWidth={100}
          {...pipeline.getProps()}
        />
      </div>
    </div>
  );
};

export default Container;
